<template>
    <div
        class="sendListQuery box_card_body"
        v-loading="pageLoading"
        element-loading-background="rgba(255, 255, 255, 0.7)"
    >
        <el-card class="box-card">
            <div slot="headerss" class="clearfix text_fl">
                <span>寄送清单查询</span>
                <el-button class="btn_close" type="text" @click="handleClose">关闭</el-button>
            </div>
            <div>
                <el-form ref="formData" :rules="rules" :model="formData" label-width="130px">
                    <el-row>
                        <el-col :span="24">
                            <div class="text_center leftWidth30">
                                <el-form-item label="手机号:" class="text_fl" prop="MOPHONE">
                                    <el-input v-model="formData.MOPHONE"></el-input>
                                    <div class="text_center dispy_in_bok margin_left30">
                                        <el-button
                                            type="primary"
                                            size="small"
                                            @click="handleClickbtn"
                                            icon="el-icon-search"
                                        >查询</el-button>
                                        <el-button
                                            type="primary"
                                            size="small"
                                            icon="el-icon-refresh-right"
                                            @click="handleClickRemove"
                                        >重置</el-button>
                                    </div>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                </el-form>
                <div>
                    <el-table
                        :data="tableData"
                        border
                        stripe
                        header-row-class-name="headerRow"
                        class="heard-bg business_table"
                        @current-change="handleCurrentChange"
                    >
                        <el-table-column label width="35">
                            <template slot-scope="scope">
                                <el-radio v-model="isChecked" :label="scope.row">{{""}}</el-radio>
                            </template>
                        </el-table-column>
                        <el-table-column label="邮寄清单">
                            <el-table-column label="手机号码">
                                <template slot-scope="scope">{{scope.row.phone}}</template>
                            </el-table-column>
                            <el-table-column label="收件人姓名">
                                <template slot-scope="scope">{{scope.row.recipient}}</template>
                            </el-table-column>
                            <el-table-column label="卡号">
                                <template slot-scope="scope">{{scope.row.cardNo}}</template>
                            </el-table-column>

                            <el-table-column label="寄送日期">
                                <template slot-scope="scope">{{scope.row.mailingTime}}</template>
                            </el-table-column>
                            <el-table-column label="寄送单号">
                                <template slot-scope="scope">{{scope.row.mailingNumber}}</template>
                            </el-table-column>
                        </el-table-column>
                    </el-table>
                </div>
                <div class="footer">
                    <el-button type="primary" size="small" @click="sendMsg()">发送短信</el-button>
                </div>
                <!-- 话术 -->
                <div class="hstable_wrap" v-if="speechList.length!=0">
                    <el-table
                        :data="speechList"
                        border
                        stripe
                        header-row-class-name="headerRow"
                        ref="showListTable"
                        class="heard-bg business_table hstable"
                        @selection-change="handleSelectionChange"
                    >
                        <el-table-column type="selection" label=" " min-width="55"></el-table-column>
                        <el-table-column label="业务话术">
                            <template slot-scope="scope">{{scope.row.content}}</template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>
        </el-card>
    </div>
</template>
<script>
import { mapGetters } from 'vuex';
import { isEmptyObject } from '@/utils/Object';
import {
    closePage, getDictSelectList,
} from '@/utils/Common';
export default {
    name: 'sendListQuery',
    data() {
        return {
            formData: {
                MOPHONE: '',
            },
            pageLoading: false,
            centerDialogVisible: false,
            centerDialogVisibleFlag: false,
            rules: {
                MOPHONE: [{ required: true, message: '手机号不能为空！', trigger: 'blur' },
                ],
            },
            BALNCE: '',//账面余额
            CREDITLIMIT: '',
            RTNIND: '',//翻页标志
            tableData: [],//寄送清单列表
            CUSTID_value: '',//选中的卡号
            certificateTypeList: '',//
            CUSTID: '',//
            KEYTYPE: '',//
            last_CUSTID: '',//循环体里 最后的一条数据
            last_KEYTYPE: '',//循环体里 最后的一条数据
            speechList: [],//话术列表
            selectedList: [],
            isChecked: {},
            currentRow: null,
        }
    },
    computed: {
        ...mapGetters([
            'defaultParams',
            'pinFlag',
            'isCurrentMenuInfo',
        ])
    },
    filters: {
        filterKetype: (value, certificateTypeList) => {
            value = (`${value}`).trim();
            for (let index = 0; index < certificateTypeList.length; index++) {
                const element = certificateTypeList[index];
                if (element.code === value) {
                    return element.label;
                }
            }
        },
    },
    async mounted() {
        this.getDicListFun();
        await this.getspeechList();
    },
    methods: {
        // 查字典
        async getDicListFun() {
            // 获取证件类型下拉选择列表
            this.certificateTypeList = await getDictSelectList('IDTYPE', this);
        },
        //根据菜单id查询话术列表
        async getspeechList() {
            console.log("this.isCurrentMenuInfo.id", this.isCurrentMenuInfo.id);
            var checkParam = {
                'id': this.isCurrentMenuInfo.id,
            };
            this.$post.busiMenu.getlistByMenuId(checkParam).then((res) => {
                console.log("话术查询结果：", res);
                if (res.status === 200) { // http通讯成功
                    if (res.data.status == 0) { // 业务请求成功
                        this.speechList = res.data.content;
                    }
                }
            });
        },
        handleSelectionChange(val) {
            this.selectedList = val;
        },
        handleCurrentChange(val) {
            this.currentRow = val;
        },
        // handleClickbtn() {
        //     this.IDList = [];
        //     this.$refs.formData.validate((valid) => {
        //         if (valid) {
        //             this.getIdCardInfo();
        //         }
        //     });
        // },
        async handleClickbtn() {

            this.$refs.formData.validate((valid) => {
                if (valid) {
                    let mobile = this.formData.MOPHONE.trim();
                    console.log("mobile************", mobile);

                    var checkParam = {
                        "pageNum": 0,
                        "pageSize": 10,
                        "phone": mobile,
                        //"phone": '15055667788',
                    };
                    this.$post.postInfo.getPostList(checkParam).then((res) => {
                        console.log("寄送清单查询结果：", res);
                        if (res.status === 200) { // http通讯成功
                            if (res.data.status == 0) { // 业务请求成功
                                this.tableData = res.data.content.records;
                            }
                        }
                    });
                }
            });
        },

        // 发送短信
        sendMsg() {
            if (isEmptyObject(this.isChecked)) {
                this.$alert('请选择一条记录！', '提示', {
                    customClass: 'warning', type: 'warning',
                });
                return;
            }
            let mobile = this.isChecked.phone;
            let cardend = this.isChecked.cardNo.substring(this.isChecked.cardNo.length - 4, this.isChecked.cardNo.length);
            let custname = this.isChecked.recipient;
            let mailingTime = this.isChecked.mailingTime;
            let mailingNumber = this.isChecked.mailingNumber;
            //尊敬的客户：经查询，您申请的我行信用卡已于近期寄出，现为您提供邮寄编号：……，建议您直接登录中国邮政官网或拨打11183/11185查询寄送信息。

            //let msgcontent = "尊敬的客户，您申请办理的我行信用卡尾号为" + cardend + "已经寄出。收件人姓名为：" + custname + "，收件人号码为：" + mobile
            //   + "，寄出时间为：" + mailingTime + "，寄送单号为：" + mailingNumber + "，请注意查收！";

            let msgcontent = "尊敬的客户：经查询，您申请的我行信用卡已于近期寄出，现为您提供邮寄编号：" + mailingNumber + "，建议您直接登录中国邮政官网或拨打11183/11185查询寄送信息。";
            console.log("msgcontent:", msgcontent);
            this.$router.push({
                name: 'dynamicMessage',
                path: '/index/dynamicMessage',
                params: {
                    tempName: '',
                    tempContent: msgcontent,
                },
            });
        },


        // 发送短信
        // sendMsg1() {
        //     if (isEmptyObject(this.isChecked)) {
        //         this.$alert('请选择一条记录！', '提示', {
        //             customClass: 'warning', type: 'warning',
        //         });
        //         return;
        //     }


        //     let mobile = this.isChecked.phone;
        //     let cardend = this.isChecked.cardNo.substring(this.isChecked.cardNo.length - 4, this.isChecked.cardNo.length);
        //     let custname = this.isChecked.recipient;
        //     let mailingTime = this.isChecked.mailingTime;
        //     let mailingNumber = this.isChecked.mailingNumber;

        //     let msgcontent = "尊敬的客户，您申请办理的我行信用卡尾号为" + cardend + "已经寄出。收件人姓名为：" + custname + "，收件人号码为：" + mobile
        //         + "，寄出时间为：" + mailingTime + "，寄送单号为：" + mailingNumber + "，请注意查收！";
        //     console.log("msgcontent:", msgcontent);
        //     const appBody = {
        //         IntfCd: '101002033032',//交易吗（系统编号+服务吗）
        //         SysId: '10100203',//系统编号
        //         TrsCd: '3032',//服务代码
        //         BrNo: '32010101',//机构号
        //         ImmedFlg: '1',//实时标志，1-实时，0-非实时
        //         BkgTm: '0',//预约时间，不预约发送，填0
        //         MblNum: mobile,//手机号码
        //         ShrtMsgCntnt: msgcontent, // 短信内容
        //     };
        //     this.defaultParams.sysHead.busiName = '寄送清单查询并发送短信';
        //     const params = JSON.parse(JSON.stringify(this.defaultParams));
        //     params.body.appHead.tranCode = '3032';
        //     params.body.appBody = appBody;

        //     // 跑 3072 交易
        //     this.$post.common.esbtran(params).then((res) => {
        //         this.pageLoading = false;
        //         if (res.status === 200) { // 接口请求成功
        //             const result = JSON.parse(res.data.jsonRes);
        //             console.log(result, 'result -- 3032');
        //             if (result.sysHead.rspCd === '000000') {
        //                 this.$alert(
        //                     '短信发送成功',
        //                     '提示',
        //                     {
        //                         center: true,
        //                         customClass: 'success', type: 'success',
        //                     },
        //                 );

        //             } else {
        //                 const errorMsg = `错误代码：${result.sysHead.rspCd}, 错误信息：${result.sysHead.rspDesc}`;
        //                 this.$alert(errorMsg, result.sysHead.rspDesc, {
        //                     customClass: 'error', type: 'error',
        //                 });
        //             }
        //         } else {
        //             this.$message.error('请求失败');
        //         }
        //     });


        // },
        // 重置 功能
        handleClickRemove() {
            this.formData.MOPHONE = '';
            this.tableData = [];
        },
        // 点击关闭
        handleClose() {
            closePage(this.$route, this, 1);
        },
    }
}
</script>
<style lang='scss' scoped>
.butclass {
    position: absolute;
    margin-left: 20px;
}
</style>
<style lang='scss'>
.sendListQuery {
    .el-form-item {
        .el-form-item__content {
            .el-input {
                width: unset;
            }
        }
    }
    .margin_20 {
        margin: 20px 0;
    }
    .footer .el-button {
        margin-top: 16px;
    }
    .footer {
        text-align: center;
        .pageInfo {
            margin-left: 20px;
            font-size: 14px;
        }
    }
}
</style>